<template>
<div>
  <back></back>
  <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
    <el-tab-pane label="社会" name="shehui"></el-tab-pane>
    <el-tab-pane label="国内" name="guonei"></el-tab-pane>
    <el-tab-pane label="国际" name="guoji"></el-tab-pane>
    <el-tab-pane label="娱乐" name="yule"></el-tab-pane>
    <el-tab-pane label="体育" name="tiyu"></el-tab-pane>
    <el-tab-pane label="军事" name="junshi"></el-tab-pane>
    <el-tab-pane label="科技" name="keji"></el-tab-pane>
    <el-tab-pane label="财经" name="caijing"></el-tab-pane>
    <el-tab-pane label="时尚" name="shishang"></el-tab-pane>
  </el-tabs>
  <newscontent :newstype="activeName"></newscontent>
  </div>
</template>

<script>
import newscontent from '../components/newscontent.vue';
import Back from '../components/back.vue';
export default {
  components: { newscontent,back:Back },
  data() {
    return {
      activeName: "shehui",
    };
  },
  methods: {
    handleClick() {
      console.log(this.activeName);
    },
  },
};
</script>
<style>

</style>